<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<link href="../images/auto_switch_logo.png" rel="icon">
	<link href="style_text/public_style.css" rel="stylesheet">
	<script src="../javascript_text/capture_replacement.js"></script>
	<script src="../javascript_text/comm_js.js"></script>
	<title>自动转换</title>
</head>
<body>
<div class="outer">
	<!-- 菜单栏开始 -->
	<div class="menu" id="navbar"></div>
	<!-- 菜单栏结束 -->
	<div class="space"></div>
	<!-- 工作栏开始 -->
	<div class="comm-taskbar-outer">
		<div class="comm-file-upload-inner">
			<button class="ripple-button">Click Me</button>
			<label class="custom-file-upload" data-action="select" for="file-upload"
				   id="file-upload-label">
				选择文件
			</label>
			<input accept="application/pdf" id="file-upload" name="pdfUpload" type="file"/>
			<div class="file-upload-text" id="file-upload-text">请上传需要转换的文件</div>
			<div class="hint">
				<span class="file-upload-text">想要批量选择</span>
				<div class="info-circle" data-modal="bulk-selection-modal">?</div>
			</div>
		</div>
		<script>captureReplacement()</script>
		<div class="space"></div>
		<div>
			<form>
				<fieldset>
					<legend>色彩模式</legend>
					<div class="radio-container">
						<input checked id="rgb" name="color-mode" type="radio" value="RGB">
						<label for="rgb">电子显示 (RGB)</label>
					</div>
					<div class="radio-container">
						<input id="gray" name="color-mode" type="radio" value="GRAY">
						<label for="gray">图像处理 (GRAY)</label>
					</div>
					<div class="radio-container">
						<input id="cmyk" name="color-mode" type="radio" value="CMYK">
						<label for="cmyk">打印效果 (CMYK)</label>
					</div>
				</fieldset>
			</form>
			<form>
				<fieldset>
					<legend>输出格式</legend>
					<div class="radio-container">
						<input checked id="PNG" name="type" type="radio" value="type-PNG">
						<label for="PNG">PNG</label>
					</div>
					<div class="radio-container">
						<input id="JPG" name="type" type="radio" value="type-JPG">
						<label for="JPG">JPG</label>
					</div>
					<div class="radio-container">
						<input id="PSD" name="type" type="radio" value="type-PSD">
						<label for="PSD">PSD</label>
					</div>
					<div class="radio-container">
						<input id="PS" name="type" type="radio" value="type-PS">
						<label for="PS">PS</label>
					</div>
					<div class="radio-container">
						<input id="PNM" name="type" type="radio" value="type-PNM">
						<label for="PNM">PNM</label>
					</div>
					<div class="radio-container">
						<input id="PGM" name="type" type="radio" value="type-PGM">
						<label for="PGM">PGM</label>
					</div>
					<div class="radio-container">
						<input id="PPM" name="type" type="radio" value="type-PPM">
						<label for="PPM">PPM</label>
					</div>
					<div class="radio-container">
						<input id="PBM" name="type" type="radio" value="type-PBM">
						<label for="PBM">PBM</label>
					</div>
					<div class="radio-container">
						<input id="PAM" name="type" type="radio" value="type-PAM">
						<label for="PAM">PAM</label>
					</div>
				</fieldset>
			</form>
			<form>
				<fieldset>
					<legend>alpha模式 (是否包含透明区域)</legend>
					<div class="radio-container">
						<input checked id="alpha-auto" name="alpha" type="radio" value="alpha-auto">
						<label for="alpha-auto">自动</label>
						<div class="info-circle" data-modal="modal1">?</div>
					</div>
					<div class="radio-container">
						<input id="alpha-on" name="alpha" type="radio" value="alpha-on">
						<label for="alpha-on">开</label>
					</div>
					<div class="radio-container">
						<input id="alpha-off" name="alpha" type="radio" value="alpha-off">
						<label for="alpha-off">关</label>
					</div>
				</fieldset>
			</form>
			<form>
				<fieldset>
					<legend>分辨率</legend>
					<div>
						<input aria-label="input"
							   class="input-box-settings" id="resolution" max="4096"
							   min="1"
							   name="resolution"
							   onblur="resetToDefaultValue('resolution', 2048, this)"
							   onclick="selectedTextInput('resolution',this)"
							   placeholder="请输入分辨率" step="1" type="number" value="2048">
					</div>
				</fieldset>
			</form>
			<div class="modal" id="modal1">
				<div class="modal-content">
					<span class="comm-modal-title">关于自动模式</span><br><br>
					<span>如果所选输出的图片格式不能为alpha模式, 就自动转成不选择此模式</span><br><br><br>
					<span class="close" data-modal="modal1">知道了</span>
				</div>
			</div>
			<div class="modal" id="bulk-selection-modal">
				<div class="modal-content">
					<span class="comm-modal-title">暂时不支持批量选择</span><br><br>
					<span class="close" data-modal="bulk-selection-modal">知道了</span>
				</div>
			</div>
			<div class="modal" id="cancel-modal">
				<div class="modal-content">
					<span class="comm-modal-title">确定要取消选择文件吗？</span><br><br>
					<span>您选择的所有文件将被取消</span><br><br><br>
					<button class="button-style1" id="confirm-cancel">确定</button>
					<br>
					<button class="button-style1" id="cancel-cancel">取消</button>
				</div>
			</div>
			<form>
				<div>
					<button class="button-style1" type="button">开始转换</button>
				</div>
				<br><br>
				<div>
					<button class="button-style1" type="button">下载转换好的文件</button>
				</div>
			</form>
		</div>
	</div>
	<!-- 工作栏结束 -->
	<div class="space3"></div>
</div>
<div class="about">
	<img alt="加载失败" class="about-img" height="60" src="../images/auto_switch_logo.png">
	<span>
		Auto Switch
	</span>
</div>
</body>
</html>